const blocks = [...document.querySelectorAll('.main .block')];

for (let i = 0; i < blocks.length; i++) {
    blocks[i].style.setProperty('--c', 'hsl(' + i / 9 * 360 + ',50%,50%)')
}

const back = document.getElementById('back');
window.addEventListener('mousemove', (e) => {
    const x = e.clientX;
    const y = e.clientY;

    const el = document.elementFromPoint(x, y);
    if (el && el.className === 'block') {
        back.style.setProperty('top', `${el.offsetTop}px`);
        back.style.setProperty('left', `${el.offsetLeft}px`);
        back.style.setProperty('background-color', window.getComputedStyle(el).getPropertyValue('--c'))
    }
})
